<!-- 护理等级列表页 -->
<template>
  <div class="min-h serveGrade bg-wt">
  
    <!-- 组件整合，其他组件需要定义在这个div内部 -->

    <SearchForm
    :searchData="pagination" 
    @handleSearch="handleSearch" 
    @handleReset="handleReset"
    @handleClear="handleClear"
    >
    </SearchForm>

    <TableList
    :listData="listData"
    :pagination="pagination"
    :total="total"
    @getCurrent="getCurrent"
    @handleBulid="newBtnAction"
    @handleEdit="editBtnAction"
    @handleClickDelete="handleClickDelete"
    @handleForbidden="handleForbidden"
    >
    </TableList>


    <DialogForm
    ref="formRef" 
    :visible="visible" 
    :title="title" 
    :data="formBaseData"
    :planData="projectList"
    @handleClose="addLevelFormClose"
    @handleAdd="confirmAddLevel" 
    @handleEditForm="confirmEditLevel"
    >
    </DialogForm>

    <!-- 删除对话框 -->
    <OperateDialog :visible="deleteVisible" delete-text="该护理项目" @handleClose="cancelDelete"
      @handleDelete="onConfirmDelete">
    </OperateDialog>

    <!-- 禁用弹窗 -->
    <Forbidden :visible="forbiddenVisible" @handleClose="closeForbidden" @handleSubmit="confirmForbidden">
    </Forbidden>
    
  </div>
</template>

<script setup lang="ts">

import { ref, onMounted } from 'vue';
import { getLevelList, getLevelDetails, levelAdd, levelUpdate, levelDelete, levelStatus, getnursAllPlanList } from '@/api/serve'

import TableList from './components/TableList.vue'
import SearchForm from './components/SearchForm.vue'
import DialogForm from './components/DialogForm.vue'
import Forbidden from '@/components/Forbidden/index.vue'
import OperateDialog from '@/components/OperateDialog/index.vue'


import { MessagePlugin } from "tdesign-vue-next";


// 要耍查询参数
const pagination = ref({
  pageNum: 1,
  pageSize: 10
})

// 表格数据
const listData = ref([])
const total = ref(0);

// 所有护理项目
const projectList = ref([])

// 新增 / 编辑 数据
var visible = ref(false)
const formRef = ref(null)
const title = ref('') // 弹窗标题
// 点击编辑按钮, 回显的数据
const formBaseData = ref({})

// 删除弹窗
const deleteVisible = ref(false) 
const deleteData = ref({}) 

 // 禁用的弹窗
const forbiddenVisible = ref(false)
const levelStatusId = ref(-1)

onMounted(() => {
  getList()
  getProjedtList()
})


const getProjedtList = async () => {
  const res = await getnursAllPlanList()
  if (res.code == 200) {
    projectList.value = res.data
  } else {
    MessagePlugin.error(res.msg)
  }
}

// ---------------------------- 查询 ----------------------------
// 分页查询
const getList = async () => {
  const res = await getLevelList(pagination.value)
  listData.value = res.data.records;
  total.value = res.data.total
}

// 分页改变事件
const getCurrent = (pageInfo) => {
  pagination.value.pageNum = pageInfo.current
  pagination.value.pageSize = pageInfo.pageSize
  getList()
}

// ------------------------------ 搜索 ---------------------------
// 搜索
const handleSearch = () => {
  pagination.value.pageNum = 1
  getList()
}

// 重置
const handleReset = () => {
  pagination.value = {
    pageNum: 1,
    pageSize: 10
  }
  getList()
}

// 清空
const handleClear = (val) => {

  if (val === 'name') {
    delete pagination.value.name
  } else {
    delete pagination.value.status
  }
  getList()
}

// ------------------------------ 新增  编辑 ---------------------------
// 新增按钮 - 打开弹窗
const newBtnAction = () => {
  title.value = "新增"
  visible.value = true
}

// 编辑按钮 - 回显 / 打开弹窗
const editBtnAction = async (row) => {
  const res = await getLevelDetails(row.id)
  formBaseData.value = res.data
  title.value = "编辑"
  visible.value = true
}

// 关闭弹窗
const addLevelFormClose = () => {
  visible.value = false
}

// 确认添加
const confirmAddLevel = async (val) => {
  const res = await levelAdd(val)
  if (res.code === 200) {
    MessagePlugin.success('添加成功')
    getList()
    addLevelFormClose()
    formRef.value.handleClear()
  }
}

// 确认编辑
const confirmEditLevel = async (val) => {
  const res = await levelUpdate(val)
  if (res.code === 200) {
    //提示，编辑成功
    MessagePlugin.success('编辑成功')
    getList()
    addLevelFormClose()
    formRef.value.handleClear()//调用子组件的方法，清理数据
  }
}

// ------------------------------ 删除 ---------------------------
// 打开弹窗
const handleClickDelete = (row) => {
  deleteVisible.value = true
  deleteData.value = row
}

// 确认删除
const onConfirmDelete = async () => {
  const res = await levelDelete(deleteData.value.id)
  if (res.code === 200) {
    //提示，编辑成功
    MessagePlugin.success('删除成功')
    getList()
    deleteVisible.value = false
  } else {
    MessagePlugin.error(res.msg);
  }
}

// 关闭弹窗
const cancelDelete = () => {
  deleteVisible.value = false
  deleteData.value = {}
}


// ---------------------------- 修改状态 --------------------------

// 修改护理等级状态
const changeLevelStatus = async (isOpen: boolean = true) => {
  const params = {
    id: levelStatusId.value,
    status: isOpen ? 1 : 0
  }

  const res = await levelStatus(params)
  if (res.code === 200) {
    MessagePlugin.success('操作成功')
    getList()
    forbiddenVisible.value = false
  } else {
    MessagePlugin.error(res.msg);
  }
}

const handleForbidden = (row) => {

  levelStatusId.value = row.id

  if (row.status === 1) {
    // 禁用
    forbiddenVisible.value = true
  } else {
    // 启用
    changeLevelStatus()
  }
}

// 确认禁用
const confirmForbidden = () => {
  changeLevelStatus(false)
}

const closeForbidden = () => {
  forbiddenVisible.value = false
  levelStatusId.value = -1
}


</script>